---
title: Loaders
description: Loader components for Tailwind CSS. UI patterns for data fetching progress, skeleton screens, and loading indicators for dashboards, forms, and content loading.
category: application
emoji: ⏳
slug: loaders
tag: new
wrapper: h-[200px]
terms:
  - progress
components:
  - { title: 'Spinner', dark: true }
  - { title: 'Spinner with message', dark: true }
  - { title: 'Spinner inline', dark: true }
  - { title: 'Loading bar', dark: true }
  - { title: 'Pulse effect', dark: true }
  - { title: 'Ping effect', dark: true }
  - { title: 'Bounce effect', dark: true }
---

import CollectionHeader from '../../../components/CollectionHeader.astro'

<CollectionHeader>
  # Loader Components

  <p>{frontmatter.description}</p>
</CollectionHeader>
